<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>chart</title>
   		<style>
		   html,body{overflow:visible;padding:0;margin:0;}
		</style>
		<{script src="moo.js" app="desktop"}>
		<{script src="coms/highcharts.js" app="desktop"}>
	</head>
	<body>

		<!-- 3. Add the container -->
		<div id="container" style="width: 100%; height: 250px; margin: 1em auto"></div>
		<script type="text/javascript">
			var chart;
		   
				chart = new Highcharts.Chart({
					  chart: {
						 renderTo: 'container',
						 defaultSeriesType: 'line',
						 marginRight: 130,
                         marginBottom: 80
					  },
					  title: {
							text: ''
					  },
					  xAxis: {
						 categories: <{$categories}>,
                         labels: {
							rotation: -45,
							align: 'right',
							style: {
                                font: 'normal 10px Verdana, sans-serif'
                            }
                        }
                          
					  },
					  yAxis: {
						 title: {text: ''}
					  },
					  tooltip: {
						 formatter: function() {
								   return '<b>'+ this.series.name +'</b><br/>'+
							   this.x +': '+ this.y +'';
						 }
					  },
					  legend: {
						 layout: 'vertical',
						 align: 'right',
						 verticalAlign: 'right',
						 x: -10,
						 y: 60,
						 borderWidth: 0
					  },
					  series: <{$data}>
			   });
				
		</script>
	</body>
</html>
